<!-- 房源组件 -->
<template>
    <view class="bg-white rounded-lg mx-4 my-2 p-4 relative">
        <view class="flex space-x-2 mb-2">
            <view>
                <image
                    class="rounded-lg w-[220rpx] h-[180rpx]"
                    mode="aspectFill"
                    src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg"
                ></image>
            </view>
            <view
                class="flex flex-col"
                style="width: calc(100% - 7rem - 16rpx)"
            >
                <view class="text-base font-semibold">{{ value.title }}</view>
                <view class="mb-3">
                    <view>{{ value.desc }}</view>
                </view>
                <view class="flex items-end">
                    <view class="text-lg text-red-600 mr-5">{{
                        value.cost
                    }}</view>
                    <view class="text-gray-400">{{ value.average }}</view>
                </view>
            </view>
        </view>
        <slot>
            <view class="mb-2 flex justify-end">
                <view
                    class="custom-btn primary plain round w-20"
                    @click="action"
                    v-if="value.step == 0"
                    >不卖了</view
                >
                <view
                    class="custom-btn primary plain round w-20"
                    @click="signContract('view')"
                    v-if="!value.step && value.step != 0"
                    >查看合同</view
                >
                <view
                    class="custom-btn warning plain round w-20"
                    @click="signContract('sign')"
                    v-if="value.step == 4"
                    >签约合同</view
                >
            </view>
        </slot>
        <view class="border-t">
            <SellStep :steps="2"></SellStep>
        </view>
        <view
            class="absolute top-0 right-0 px-3 leading-7 text-white rounded-bl-lg rounded-tr-lg"
            :class="'success'"
            >成交中</view
        >
    </view>
</template>
<script setup lang="ts">
import SellStep from "@/components/SellStep/index.vue";
import { checkEnum } from "@/enum";
import { $global } from "@/store";
import type { listType } from "@/types";
type Props = {
    value: listType;
    step?: checkEnum;
};
withDefaults(defineProps<Props>(), {
    step: checkEnum.check,
});

const emit = defineEmits<{
    itemClick: [act: "disSell" | "view" | "sign"];
}>();
const action = () => {
    emit("itemClick", "disSell");
};

const signContract = (type: "sign" | "view") => {
    $global.movePath(`/pages/mine/children/ContractDetail/index?type=${type}`);
};
</script>
<style scoped lang="scss"></style>
